﻿// 滚动
//<div id="xxx">
//  <div><!--item-->
//  </div>
//</div>
Function.registerNameSpace("Page");

Page.Scroll=function(domId){
    this.itemWidth=100;
    this.itemHeight=20;
    this.showNum=1;
    this.items=[];
    this.cloneItems=[];
    this.htmls=[];
    this.delay=2000;//毫秒为单位
    this.speed=400;//每秒种滚入的像素数
    this.__delaySto=null;
    this.__scrollSto=null;
    this.__scrollBox=null;
    this.__direction="up";
    
    if(domId){
        this.__scrollBox=$(domId);
        //内容块
        this.__contentBox=document.createElement("div");
        this.__contentBox.innerHTML=this.__scrollBox.innerHTML;
        this.__scrollBox.innerHTML="";
        this.__scrollBox.appendChild(this.__contentBox);
        
        //清除浮动块
        this.___clearDiv=document.createElement("div");
        this.___clearDiv.style.clear="both";
        this.__scrollBox.appendChild(this.___clearDiv);

        this.items=this.____getItems(this.__contentBox);
        if(this.items.length>0){
            this.itemWidth=this.items[0].offsetWidth;
            this.itemHeight=this.items[0].offsetHeight;
        }
    }    
    
    this.itemLength=this.itemHeight;
    this.____scrollInLen=0;
    this.____totalLen=0;
    
    this.____resetBox();
}

//添加一个项目
Page.Scroll.prototype.AddItem=function(html){
    if(this.__scrollBox){
        var dom=document.createElement("div");
        if(this.cloneItems.length>0){
            this.__contentBox.insertBefore(dom,this.coneItems[0])
        }else{
            this.__contentBox.appendChild(dom);
        }
        dom.innerHTML=html;
        this.____resetBox();
    }else{
        this.htmls.push(html);
    }
}

Page.Scroll.prototype.AutoScroll=function(isScroll){

}

//设置滚动方向
//up,down,left,right
Page.Scroll.prototype.SetDirection=function(direction){
    this.__direction=direction;
    this.____resetBox();
}

Page.Scroll.prototype.SetItemWidth=function(width){
    this.itemWidth=width;
    this.____resetBox();
}

Page.Scroll.prototype.SetItemHeight=function(height){
    this.itemHeight=height;
    this.____resetBox();
}

Page.Scroll.prototype.SetShowNum=function(num){
    this.showNum=num;
    this.____resetBox();
}

Page.Scroll.prototype.GetItemCount=function(){
    return this.items.length;
}

Page.Scroll.prototype.SetDelay=function(delay){
    this.delay=delay;
}

Page.Scroll.prototype.PutInDom=function(domID){
    if(!this.__scrollBox){
        this.__scrollBox=document.createElement("div");
        $(domID).appendChild(this.__scrollBox);
        //内容块
        this.__contentBox=document.createElement("div");
        this.__contentBox.innerHTML=this.__scrollBox.innerHTML;
        this.__scrollBox.appendChild(this.__contentBox);
        
        //加入内容
        for(var i=0;i<this.htmls.length;i++){
            var item=document.createElement("div");
            this.__contentBox.appendChild(item);
            item.innerHTML=this.htmls[i];
            this.items.push(item);
        }
        
        //清除浮动块
        this.___clearDiv=document.createElement("div");
        this.___clearDiv.style.clear="both";
        this.__scrollBox.appendChild(this.___clearDiv);
        this.____resetBox();
    }
}

Page.Scroll.prototype.Start=function(){
    this.______run();
}

Page.Scroll.prototype.Next=function(){
    
}

Page.Scroll.prototype.Previous=function(){

}

Page.Scroll.prototype.____resetBox=function(){
    //更改样式
    this.__scrollBox.style.padding=0;
    this.__scrollBox.style.margin=0;
    this.__scrollBox.style.borderWidth=0;
    this.__scrollBox.style.overflow="hidden";
    
    this.__contentBox.style.padding=0;
    this.__contentBox.style.margin=0;
    this.__contentBox.style.borderWidth=0;
    
    switch(this.__direction){
        case "up":
        case "down":
            this.__scrollBox.style.width=this.itemWidth+"px";
            this.__scrollBox.style.height=this.itemHeight*this.showNum+"px";
            this.____totalLen=this.itemHeight*2*this.items.length;
            this.__contentBox.style.width=this.itemWidth+"px";
            this.__contentBox.style.height=this.____totalLen+"px";

            this.itemLength=this.itemHeight;
            break;
        case "left":
        case "right":
            this.__scrollBox.style.width=this.itemWidth*this.showNum+"px";
            this.__scrollBox.style.height=this.itemHeight+"px";
            this.____totalLen=this.itemWidth*2*this.items.length;
            this.__contentBox.style.width=this.____totalLen+"px";
            this.__contentBox.style.height=this.itemHeight+"px";
            this.__scrollBox.scrollLeft=this.____totalLen
            this.itemLength=this.itemWidth;
            break;
    }
    
    //克隆附本
    for(var i=this.cloneItems.length;i<this.items.length;i++){
        var item=this.items[i].cloneNode(true);
        this.cloneItems.push(item);
        this.__contentBox.appendChild(item);
    }
    
    //整理项目
    for(var i=0;i<this.items.length;i++){
        this.items[i].style.height=this.itemHeight+"px";
        this.items[i].style.width=this.itemWidth+"px";
        this.items[i].style.cssFloat="left";
        this.items[i].style.styleFloat="left";
        this.items[i].style.overflow="hidden";
    }
    for(var i=0;i<this.cloneItems.length;i++){
        this.cloneItems[i].style.height=this.itemHeight+"px";
        this.cloneItems[i].style.width=this.itemWidth+"px";
        this.cloneItems[i].style.cssFloat="left";
        this.cloneItems[i].style.styleFloat="left";
        this.cloneItems[i].style.overflow="hidden";
    }
}

Page.Scroll.prototype.____getItems=function(box){
    var items=[];
    var nodes=box.childNodes;
    var len=nodes.length;
    for(var i=0;i<len;i++){
        var node=nodes[i];
        if(node.nodeType==1){
            items.push(node);
        }
    }
    return items;
}


Page.Scroll.prototype.______run=function(){
    var oThis=this;
    
    var t=this.delay+this.itemLength/this.speed*1000;
    //this.______next();
    this.__delaySto=window.setTimeout(function(){oThis.______next()},this.delay);
}



Page.Scroll.prototype.______next=function(){
    var oThis=this;
    clearTimeout(this.__delaySto);
    clearInterval(this.__scrollSto);
    this.____itemInLen=0;

    this.__scrollSto=setInterval(function(){oThis.______scroll()},10);
}

Page.Scroll.prototype.______scroll=function(){
    var oThis=this;
    var miiSteep=this.speed/100;
    this.____scrollInLen+=miiSteep;
    this.____itemInLen+=miiSteep;
    if(this.itemLength*this.items.length<=this.____scrollInLen){
        this.____scrollInLen-=this.itemLength*this.items.length;
    }
    if(this.____itemInLen>=this.itemLength){
        this.____scrollInLen-=this.____itemInLen-this.itemLength;
        clearInterval(this.__scrollSto);
        this.__delaySto=window.setTimeout(function(){oThis.______next()},this.delay);
        this.____itemInLen=0;
    }
    switch(this.__direction){
        case "up":
            this.__scrollBox.scrollTop=this.____scrollInLen;
            break;
        case "down":
            this.__scrollBox.scrollTop=this.____totalLen-this.____scrollInLen;
            break;
        case "left":
            this.__scrollBox.scrollLeft=this.____scrollInLen;
            break;
        case "right":
            this.__scrollBox.scrollLeft=this.____totalLen-this.____scrollInLen;
            break;
    }
}

Page.Scroll.prototype.______scrollBack=function(){
    
}
